<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        #djs span{
            color: red;
        }
    </style>
</head>
<body>
<div id="djs">
    距离教师节还有<span></span>天<span></span>时<span></span>分<span></span>秒
</div>
<script>
    var djsObj = document.getElementById('djs');


    var teacherDay = '2017-9-10';

    function djs(){
        var endDate = new Date(teacherDay);
        var nowDate = new Date();//表示现在的时间

        var ms = endDate.getTime()-nowDate.getTime();
        console.log(ms);
        var s = Math.floor(ms/1000);
        console.log(s);
        var d = Math.floor(s/(24*60*60));
        var s = s%(24*60*60);


        h = Math.floor(s/(60*60));
        s = s%(60*60);

        m = Math.floor(s/(60));
        s = s%(60);

        djsObj.children[0].innerHTML = d;
        djsObj.children[1].innerHTML = h>9 ? h : '0'+h;
        djsObj.children[2].innerHTML = m;
        djsObj.children[3].innerHTML = s;
        console.log(d+'天'+h+'小时'+m+'分'+s+'秒');
    }
    setInterval(djs,1000);


    /*
    1234
    1234/(10*10*10)   == 1
     1234%(10*10*10)  == 234
     234/(10*10)  == 2
     234%(10*10) == 34
     34/(10)  == 3
     34%(10) = 4

     1062245  / (24*60*60)      == 12天
     1062245  %(24*60*60)       = 25445 秒
     25445 / (60*60)            = 7小时
     25445 % (60*60)            = 245 秒
     245 / (60)                 = 4 分
     245 % (60)                 = 5秒



     */
</script>

</body>
</html>